<template>
  <div
    v-loading="loading"
    element-loading-text="拼命加载中"
    element-loading-spinner="el-icon-loading"
    element-loading-background="rgba(0, 0, 0, 0.8)">
    <!--搜索栏-->
    <common-list-search-bar
      v-if="!($props.productData && $props.productData.id)"
      ref="commonListSearchBar"
      :field-arr="searchSittingArray"
      :search-list="searchList">
<!--      <template slot="actButton">-->
<!--        <el-button type="primary" @click="createProduct">新增</el-button>-->
<!--      </template>-->
    </common-list-search-bar>
    <common-list-table
      ref="myCommonListTable"
      :sitting="listTableSitting"
      :search-list="searchList">
      <template slot="actSlot" slot-scope="scope">
        <my-button type="primary" :click="function (){stockList(scope)}" text="日志详情" access-action="Product/getStockLogList"></my-button>
        <my-button type="danger" :click="function (){editStockNums(scope)}" text="更新库存" access-action="Product/manage"></my-button>
        <my-button type="danger" :click="function (){editStock(scope)}" text="编辑" access-action="Product/manage"></my-button>
        <my-button type="danger" :click="function (){delStock(scope)}" text="删除" :disabled="scope.rowInfo.isDefault.id===1" access-action="Product/manage"></my-button>
        <my-button type="success" :click="function (){copyLink(scope)}" text="复制链接" ></my-button>
      </template>
    </common-list-table>

    <create-stock-dialog ref="createStockDialog" :success-function="searchList"/>
    <shop-stock-log-list-dialog ref="supplierStockLogListDialog"/>
    <edit-stock-nums-dialog ref="edit-stock-nums-dialog" :success-function="searchList"/>
  </div>
</template>

<script>

import CreateProductDialog from '../Dialog/CreateProductDialog'
import CreateStockDialog from '../Dialog/CreateStockDialog'
import ShopStockLogListDialog from '../Dialog/ShopStockLogListDialog'
import MyButton from '../Common/MyButton'
import EditStockNumsDialog from '../Dialog/EditStockNumsDialog'

export default {
  name: 'ProductStockPage',
  components: {
    EditStockNumsDialog,
    MyButton, ShopStockLogListDialog, CreateStockDialog, },
  props:{
    productData:Object
  },
  mounted () {
    // 模拟数据
    // this.$refs.myCommonListTable.setListData(DemoData.Product.list)
    this.searchList()
    if (this.$props.productData){
      this.$refs.createStockDialog.setProduct(this.$props.productData)
    }
  },
  data:function () {
    return {
      loading:false,
      // 搜索栏配置项
      searchSittingArray:Object.assign([],this.getFieldArr()),
      listTableSitting:{
        modelName:'商品库存-列表',
        fieldArr:this.getFieldArr(),
        tableHeight:(this.$props.productData && this.$props.productData.id)?500:this.getTableHeight(),
        page:1,
        pageSize:20,
        actColumnWidth:430,
        defaultSort:{
          // prop:'username',
          // order:'descending',
        }
      }
    }
  },
  methods:{
    getFieldArr:function () {
      if (this.$props.productData && this.$props.productData.id){
        return DemoData.ProductStockSimple.field;
      }else{
        return DemoData.ProductStock.field;
      }
    },
    getTableHeight:function () {
      var height=this.getWinSize().height-225
      return height>500?height:500
    },
    // 初始化查询
    searchList:function () {
      // 表格列表,查询参数
      var listTableForm=this.$refs.myCommonListTable.formData

      // 搜索栏,查询参数
      var searchBarForm={}
      if (this.$props.productData && this.$props.productData.id){
        searchBarForm.supplierProductId=this.$props.productData.id
      }else{
        searchBarForm=this.$refs.commonListSearchBar.getFormData()
      }
      if (this.$route.query && this.$route.query.id){
        searchBarForm.id=this.$route.query.id
      }


      var form=Object.assign({},listTableForm,searchBarForm)
      // 如果有默认排序 && 默认排序数据未设置,就进行查询请求(默认排序设置会触发查询)
      if (this.listTableSitting.defaultSort && this.listTableSitting.defaultSort.prop && this.$refs.myCommonListTable.formData.sortOrder===''){
        return ''
      }

      let $this=this
      $this.loading=true
      $this.MyRequest($this.ApiDoNameSupplier+'Product/getStockList',form,function (data) {
        $this.$refs.myCommonListTable.setListData(data)
        $this.loading=false
        $this.$forceUpdate()
      })
    },
    // 编辑库存
    editStock:function (infoParams) {
      var info={}
      if (infoParams && infoParams.rowInfo){
        info=infoParams.rowInfo
      }
      // console.log('this.$refs.createStockDialog',this.$refs.createStockDialog)
      this.$refs.createStockDialog.open(info)
    },
    editStockNums: function (info) {
      this.$refs['edit-stock-nums-dialog'].open(info.rowInfo)
    },
    // 删除单条数据
    delStock: function (info) {
      let $this = this
      this.$confirm('您确认要进行该操作吗, 是否继续?', '系统提醒', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        $this.loading = true
        $this.MyRequest($this.ApiDoNameSupplier + 'Product/deleteModel', {id: info.rowInfo.id}, function () {
          $this.loading = false
          $this.$message({
            type: 'success',
            message: '删除成功'
          })
          $this.searchList()
          $this.$forceUpdate()
        }, function (res) {
          $this.$message.error(res.message)
          $this.loading = false
        })
      })
    },
    copyLink:function (infoParams) {
      let $this=this
      this.$copyText('【可可商城-店铺系统】'+infoParams.rowInfo.supplierProductName+' '+infoParams.rowInfo.model+' '+location.protocol+'//shop.yangfankj.com'+'/#/SupplierProductSearchPage?id='+infoParams.rowInfo.id).then(
        e=>{
          $this.$message.success('复制商品信息成功')
        },
        e=>{
          console.log('复制失败：', e);
        }
      )
    },
    stockList:function (infoParams) {
      var info={}
      if (infoParams && infoParams.rowInfo){
        info=infoParams.rowInfo
      }
      this.$refs.supplierStockLogListDialog.open('SupplierProductStock',info)
    }
  }
}
</script>

<style scoped>

</style>
